<template>
	<view class="page page-fill">
		<view class="page-block info-list">
			<!-- 头像 -->
			
			<view class="item-wapper face-line-upbottom" @click="operator">
				<view class="info-words">头像</view>
				
				<view class="right-wapper">
					<image :src="userInfo.faceImage" class="face"></image>
					<view class="arrow-block">
						<image src="../../static/icos/left-gray-arrow.png" class="arrow-ico"></image>
					</view>
				</view>
			</view>
			
			<view class="line-top">
				<view class="line"></view>
			</view>
			
			<!-- 昵称 -->
			<view class="item-wapper" @click="modifyNickname">
				<view class="info-words">昵称</view>
				
				<view class="right-wapper">
					<view class="gray-fields">
						{{userInfo.nickname}}
					</view>
					<view class="arrow-block">
						<image src="../../static/icos/left-gray-arrow.png" class="arrow-ico"></image>
					</view>
				</view>
			</view>
			
			<view class="line-top">
				<view class="line"></view>
			</view>
			
			<!-- 生日 -->
			<view class="item-wapper" @click="modifyBirthday">
				<view class="info-words">生日</view>
				
				<view class="right-wapper">
					<view class="gray-fields">
						{{userInfo.birthday}}
					</view>
					<view class="arrow-block">
						<image src="../../static/icos/left-gray-arrow.png" class="arrow-ico"></image>
					</view>
				</view>
			</view>
			
			<view class="line-top">
				<view class="line"></view>
			</view>
			
			<!-- 性别 -->
			<view class="item-wapper" @click="modifySex">
				<view class="info-words">性别</view>
				
				<view class="right-wapper">
					<view class="gray-fields">
						
						<view v-if="userInfo.sex == 0">
							男
						</view>
						<view v-else-if="userInfo.sex == 1">
							女
						</view>
						<view v-else>
							未选择
						</view>
						
					</view>
					<view class="arrow-block">
						<image src="../../static/icos/left-gray-arrow.png" class="arrow-ico"></image>
					</view>
				</view>
			</view>
			
		</view>
		
		<view class="footer-wapper">
			<view class="footer-words" style="margin-top: 10upx;" @click="logout">
				退出登录
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:{},//用户信息
			}
		},
		onShow() {
			this.userInfo = uni.getStorageSync("globalUser");
		},
		methods: {
			//清理缓存
			cleanStorage(){
				uni.clearStorageSync();
				uni.showToast({title:"清理缓存成功",duration:2000,mask:false,icon:'none'});
			},
			//退出登录
			logout(){
				uni.request({
				    url: this.serverUrl+'/user/logout'+this.user_authority+'&userId='+this.userInfo.id, //仅为示例，并非真实接口地址。
				    method:"POST",
				    success: (res) => {
						//判断请求状态
						if(res.data.status == 200){
							this.cleanStorage();
							uni.showToast({title:"退出登录成功",duration:2000,icon:'none'});
							setTimeout(()=>{
								uni.switchTab({url:"../index/index"})
							},2000)
						}
						else{
							uni.showToast({title:res.data.msg,duration:2000,icon:'none'});
						}
				    }
				});
			},
			//头像编辑
			operator(){
				uni.showActionSheet({
					itemList:["查看我的头像","从相册选择上传"],
					success: (res) => {
						let index = res.tapIndex ;
						if(index == 0){
							//预览头像
							let faceArr = [];
							faceArr.push(this.userInfo.faceImage);
							//图片预览
							uni.previewImage({
								urls:faceArr,
								current:faceArr[0]
							})
						}
						else{
							//上传头像							
							uni.chooseImage({
							    count: 1, //默认9
							    sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
							    sourceType: ['album'], //从相册选择
							    success: function (res) {							  
									let tempFilePath = res.tempFilePaths[0];
									uni.navigateTo({url:"../meFace/meFace?tempFilePath="+tempFilePath});
							    }
							});														
						}
					}
				})
			},
			//跳转到修改昵称
			modifyNickname(){
				uni.navigateTo({
					url:'../meNickname/meNickname'
				})
			},
			//日期
			modifyBirthday(){
				uni.navigateTo({
					url:'../meBirthdy/meBirthdy'
				})
			},
			//性别
			modifySex(){
				uni.navigateTo({
					url:'../sex/sex'
				})
			}
		}
	}
</script>

<style>
	@import url("meInfo.css");
</style>
